<%
var headerPart = {
%>
<% include("/include/treeview.html"){} %>
<style>
	html{background-color: #fff!important;}
</style>
<% }; %>
<% layout("/layouts/micro.html",{headerSection:headerPart}){ %>
<div class="childrenBody">
    <div class="layui-tab-content">
	<form id="inputForm"  action="${ctx}/sys/role/save" method="post"  class="layui-form layui-row">
		<div class="layui-col-md3">
			<div class="layui-form-item">
				<label class="layui-form-label">角色授权:</label>
				<div class="layui-input-block">
					<div id="menuTree" class="ztree" style="margin-top:3px;float:left;"></div>
					<input type="hidden" name="menuIds" id="menuIds" value="${role.menuIds}"/>
					<div id="officeTree" class="ztree" style="margin-left:100px;margin-top:3px;float:left;"></div>
					<input type="hidden" name="officeIds" id="officeIds" value="${role.officeIds}"/>
				</div>
			</div>
		</div>
		<div class="layui-col-md9">
		<input type="hidden" name="id" value="${role.id}"/>
		<#message content="${message!}"/>
		<div class="layui-form-item">
			<label class="layui-form-label">归属机构:</label>
			<div class="layui-input-inline">
                <#treeselect id="office" name="office.id" value="${role.office.id!}" labelName="office.name" labelValue="${role.office.name!}"
					title="机构" url="/sys/office/treeData" />
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">角色名称:</label>
			<div class="layui-input-inline">
				<input id="oldName" name="oldName" type="hidden" value="${role.name}">
				<input type="text" name="name" value="${role.name}" htmlEscape="false" maxlength="50" class="layui-input" lay-verify="required|validatename"/>
			</div>		
			<div class="layui-form-mid "><font color="red">*</font> </div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">英文名称:</label>
			<div class="layui-input-inline">
				<input id="oldEnname" name="oldEnname" type="hidden" value="${role.enname}">
				<input type="text" name="enname" value="${role.enname}" htmlEscape="false" maxlength="50" class="layui-input" lay-verify="required"/>
			</div>
			<div class="layui-form-mid layui-word-aux"><font color="red">*</font>工作流用户组标识</div>
		</div>
		
		<div class="layui-form-item">
			<label class="layui-form-label">角色类型:</label>
			<div class="layui-input-inline">
				<select name="roleType" class="input-medium" lay-verify="required">
					<option value="assignment">任务分配</option>
					<option value="security-role">管理角色</option>
					<option value="user">普通角色</option>
				</select>
			</div>
			<div class="layui-form-mid layui-word-aux"><font color="red">*</font>工作流组用户组类型（任务分配：assignment、管理角色：security-role、普通角色：user）</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">是否系统数据:</label>
			<div class="layui-input-inline">
				<select name="sysData">
					<#options items="${@DictUtils.getDictList('yes_no')}" value="${role.sysData}"/>
				</select>
			</div>
			<div class="layui-form-mid layui-word-aux">“是”代表此数据只有超级管理员能进行修改，“否”则表示拥有角色修改人员的权限都能进行修改</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">是否可用</label>
			<div class="layui-input-inline">
				<select name="useable">
					<#options items="${@DictUtils.getDictList('yes_no')}" value="${role.useable}"/>
				</select>
			</div>
			<div class="layui-form-mid layui-word-aux">“是”代表此数据可用，“否”则表示此数据不可用</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">数据范围:</label>
			<div class="layui-input-inline">
				<select name="dataScope" class="input-medium" lay-filter="dataScope">
					<#options items="${@DictUtils.getDictList('sys_data_scope')}" value="${role.dataScope}"/>
				</select>
			</div>
			<div class="layui-form-mid layui-word-aux">特殊情况下，设置为“按明细设置”，可进行跨机构授权</div>
		</div>
		<div class="layui-form-item layui-form-text">
			<label class="layui-form-label">备注:</label>
			<div class="layui-input-block">
				<textarea name="remarks" htmlEscape="false" rows="3" maxlength="200" class="layui-textarea">${role.remarks}</textarea>
			</div>
		</div>
		<div class="layui-form-item layui-hide">
	    	<div class="layui-input-block">
				<%
					var flag = @DictUtils.getDictValue('是', 'yes_no', '1');
					var user = @UserUtils.getUser();
					if((role.sysData==flag && user.admin)||(role.sysData!=flag)){
				%>
				<%if(shiro.hasPermission("sys:role:edit")){%>
      				<button class="layui-btn" lay-filter="roleForm" id="roleForm" lay-submit>保 存</button>
      			<%}%>
   				<%}%>
	       		<button type="reset" class="layui-btn layui-btn-primary" onclick="history.go(-1)">返回</button>
		    </div>
	  	</div>
		</div>
	</form>
	</div>
</div>
<script type="text/javascript">
	$(document).ready(function(){
		$("#name").focus();

		layui.use(['form','jquery'],function(){
			var $ = layui.jquery, form = layui.form;
			form.render();
			form.on('submit(*)', function(data){
				var ids = [], nodes = tree.getCheckedNodes(true);
				for(var i=0; i<nodes.length; i++) {
					ids.push(nodes[i].id);
				}
				$("#menuIds").val(ids);
				var ids2 = [], nodes2 = tree2.getCheckedNodes(true);
				for(var i=0; i<nodes2.length; i++) {
					ids2.push(nodes2[i].id);
				}
				$("#officeIds").val(ids2);
				return true; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
			});
		});

		var setting = {check:{enable:true,nocheckInherit:true},view:{selectedMulti:false},
			data:{simpleData:{enable:true}},callback:{beforeClick:function(id, node){
				tree.checkNode(node, !node.checked, true, true);
				return false;
			}}};

		// 用户-菜单
		var zNodes=[<%for(menu in menuList){%>{id:"${menu.id}", pId:"${isNotEmpty(menu.parent.id)?menu.parent.id:0}", name:"${isNotEmpty(menu.parent.id)?menu.name:'权限列表'}"},
				<%}%>];
		// 初始化树结构
		var tree = $.fn.zTree.init($("#menuTree"), setting, zNodes);
		// 不选择父节点
		tree.setting.check.chkboxType = { "Y" : "ps", "N" : "s" };
		// 默认选择节点
		var ids = "${role.menuIds}".split(",");
		for(var i=0; i<ids.length; i++) {
			var node = tree.getNodeByParam("id", ids[i]);
			try{tree.checkNode(node, true, false);}catch(e){}
		}
		// 默认展开全部节点
		tree.expandAll(true);

		// 用户-机构
		var zNodes2=[<%for(office in officeList){%>
				{id:"${office.id}", pId:"${isNotEmpty(office.parent)?office.parent.id:0}", name:"${office.name}"},
				<%}%>];
		// 初始化树结构
		var tree2 = $.fn.zTree.init($("#officeTree"), setting, zNodes2);
		// 不选择父节点
		tree2.setting.check.chkboxType = { "Y" : "ps", "N" : "s" };
		// 默认选择节点
		var ids2 = "${role.officeIds}".split(",");
		for(var i=0; i<ids2.length; i++) {
			var node = tree2.getNodeByParam("id", ids2[i]);
			try{tree2.checkNode(node, true, false);}catch(e){}
		}
		// 默认展开全部节点
		tree2.expandAll(false);
		// 刷新（显示/隐藏）机构
		refreshOfficeTree();
		layui.use(['form','jquery'],function(){
			var $ = layui.jquery, form = layui.form;
			form.on('select(dataScope)', function(data){
				refreshOfficeTree();
			});
		});
	});
	function refreshOfficeTree(){
		if($("#dataScope").val()==9){
			$("#officeTree").show();
		}else{
			$("#officeTree").hide();
		}
	}
</script>
<script>
    layui.use(['form','laydate'], function(){
        var form = layui.form,laydate = layui.laydate;
        form.render();
    });
</script>
<%}%>